<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>停车场管理系统</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f4f4f4;
            margin: 0;
            padding: 0;
        }

     .container {
            width: 100%;
            max-width: none;
            padding: 20px;
            box-sizing: border-box;
        }

     .header {
            background-color: #007bff;
            color: white;
            font-size: 24px;
            padding: 20px 0;
            width: 100%;
            text-align: center;
        }

     .nav {
            background-color: #f2f2f2;
            padding: 10px 0;
            display: flex;
            justify-content: center;
            border-bottom: 1px solid #ccc;
        }

     .nav a {
            text-decoration: none;
            color: #007bff;
            padding: 10px 20px;
            border: 1px solid #ccc;
            border-radius: 5px;
            margin: 0 5px;
            background-color: white;
        }

     .nav a:hover {
            background-color: #e6e6e6;
        }

     .image-section {
            text-align: center;
            margin-top: 20px;
        }

     .image-section img {
            max-width: 100%;
            height: auto;
        }

        table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 20px;
        }

        th, td {
            padding: 10px;
            border: 1px solid #ccc;
        }

        th {
            background-color: #007bff;
            color: white;
        }

     .left-align {
            text-align: left;
        }

      /* 新增返回按钮样式 */
     .return-button {
            margin-top: 15px;
            padding: 8px 16px;
            background-color: #007bff;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            transition: background-color 0.3s ease;
        }

     .return-button:hover {
            background-color: #0056b3;
        }
    </style>
</head>

<body>
    <div class="container">
        <div class="header">停车场管理系统</div>
        <div class="nav">
            <a href="add_parking_info.html">添加停车场</a> |
            <a href="modify_parking_info.html">修改停车场信息</a> |
            <a href="delete_parking_info.html">删除停车场信息</a> |
            <a href="view_parking_info_list.html">查看停车场信息</a>
        </div>
        <div class="image-section">
            <img id="tupi" src="../images/停车场图片1.png" alt="停车场图片">
        </div>
        <table>
            <tr>
                <th colspan="2">管理员管理停车场说明</th>
            </tr>
            <tr>
                <td class="left-align">欢迎管理员使用停车场管理系统，在此系统中，您可以进行以下操作：</td>
            </tr>
            <tr>
                <td colspan="2" class="left-align">1. 添加停车场：通过“添加停车场”页面，您可以输入新停车场位的详细信息，包括停车场名称、地址、总车位数、开放时间等，并保存到系统中。请确保信息的准确性和完整性，以便后续管理和查询。</td>
            </tr>
            <tr>
                <td colspan="2" class="left-align">2. 修改停车场信息：在“修改停车场信息”页面，您可以查看并更新现有车位的信息。例如，当停车场的车位数发生变化、营业时间调整或者停车场设施更新时，及时在此处进行修改，以保证系统数据的时效性和准确性。</td>
            </tr>
            <tr>
                <td colspan="2" class="left-align">3. 删除停车场：使用“删除停车场”功能，您可以从系统中移除不再需要的停车场。但请注意，此操作将永久删除该停车场及其相关信息，操作前请谨慎确认，避免误删重要数据。</td>
            </tr>
            <tr>
                <td colspan="2" class="left-align">4. 查看停车场列表：在“查看停车场列表”页面，您可以查看系统中所有停车场的信息，包括停车场的基本信息、当前车位使用情况等。这有助于您全面了解停车场的运营状态，方便进行统一管理和调度。</td>
            </tr>
            <!-- 这里可以根据需要添加更多的说明内容 -->
        </table>

    </div>
</body>

</html>